import Taro, { Component } from '@tarojs/taro'
import { View } from '@tarojs/components'

import Enum from '../../constants/Enum'
import './style.less';

import SubTitle from '../SubTitle'

const { categorySymbolMap } = Enum;

class HistoryInfoList extends Component {
  static defaultProps = {
    logs: []
  }
  render() {
    const { logs } = this.props
    let arr = logs.map(item => {
      const { operator, op1, op2, result } = item;
      if (categorySymbolMap[operator] === '+') {
        item.correct = op1 + op2 === result
      } else if (categorySymbolMap[operator] === '-') {
        item.correct = op1 + op2 === result
      }
      return item
    })
    arr = arr.filter(item => item.correct === false)
    return (
      <View className='historyInfoList' >
        <SubTitle title='错题列表' />
        {
          arr.map(item => {
            const { operator, op1, op2, result } = item;
            return (
              <View className='item' key={item.id} >
                <View className='text' >
                  <View className='formula' >{op1}{categorySymbolMap[operator]}{op2}={result}</View>
                  <View className='time' >用时: 5秒</View>
                </View>
              </View>
            )
          })
        }
      </View>
    )
  }
}

export default HistoryInfoList
